import { publish } from 'pubsub-js';
import { emoji } from '../../assets/js/emoji';

import {
    emoji_content,
    emoji_item,
} from './index.module.css'

function EmojiPopup() {


    function confirmFace(item) {
        publish('insert_message', `[${item.name}]`);

    }

    return (
        <div className={emoji_content}>
            {
                emoji.map(item => {
                    return (
                        <div key={item.name} className={emoji_item} title={item.name} onClick={() => confirmFace(item)}>{item.icon}</div>
                    )
                }) 
            }
        </div>
    )
}

export default EmojiPopup;
